<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<script src="jquery-2.1.4.js"></script>
<style>
   body{
    background-color: #f5f5f5;
    margin: 0;
   } 
   .bindCard_dis{
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    display: flex;
    justify-content: space-between;
    border-bottom:1px solid #f7f5f5;
    box-sizing: border-box;
    background-color: #fff;
}
.bindCard_dis_a{
    padding-left: 20px;
}
.bindCard_dis_a img{
  width: 24px;
  height: 24px;
  vertical-align: middle;
  margin-right: 10px;
}
.bindCard_dis_b{
    margin-right: 20px;
}
.bindCard_dis_b input{
    width: 200px;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    border: none;
    outline: none;
    text-align: right;
}
.bindCard_dis_a input{
  width: 120px;
  height: 40px;
  border: none;
  outline: none;
}
.bindCard_dis_b span{
  display: inline-block;
  background-color: #ff5555;
  height: 30px;
  line-height: 30px;
  color: #fff;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 5px;
  font-size: 14px;
  margin-top: 10px;
}
    .mcht_btn{
        width: 90%;
        margin: 0 auto;
        height: 40px;
        line-height: 40px;
        border-radius: 5px;
        margin-top: 30px;
    }
    .prompt_text{
      text-align: center;
      line-height: 50px;
    }
    .prompt_text span{
      color: red;
      font-size: 20px;

    }
</style>
<div class='fui-cell-group' style="margin-top: 3.6rem;">
    <div class='fui-cell' style="height:auto;background-color:#fff;margin:3.6rem auto;padding-top:10px;padding-bottom: 20px;">
        <div class='fui-cell-info'>
          <div class="prompt_text"><span>*</span>您当前操作为解绑银行卡，请确认</div>
          <div class="prompt_text" style="display: none;"><span>*</span>您当前操作为绑定银行卡，请确认</div>
          <div class="prompt_text" style="display: none;"><span>*</span>您当前操作为修改银行卡，请确认</div>
          <div class="prompt_text" style="display: none;"><span>*</span>您当前操作为设置结算卡，请确认</div>
            <div class="bindCard_dis">
               <div class="bindCard_dis_a"><img src="mobile.png" alt=""><input type="text" value="18778989889" readonly></div>
               <div class="bindCard_dis_b"></div>
           </div>
            <div class="bindCard_dis">
               <div class="bindCard_dis_a"><img src="mobile.png" alt=""><input type="text" placeholder="短信验证码"></div>
               <div class="bindCard_dis_b"><span onclick="sendMessage()" id="sendBtn">获取验证码</span></div>
           </div>
           
     
        </div>
    </div>
</div>
<div class="fui-cell-group fui-cell-click transparent" style="margin-top: 10px;">
    <div class="fui-cell external btn-logout" id = 'mcht'>
        <div class="fui-cell-text mcht_btn" style="text-align: center; color:#ffffff;background:#ff5555"><p>下一步</p></div>
    </div>
</div>

<script language="javascript">

    function sendMessage() {
    var sTime = 60,     //倒计时的时间
        timer = null;
    var btn = $("#sendBtn");
    clearTimeout(timer);
    timer = setTimeout(function () {
        if (sTime == 0) {
            btn.removeClass('disabled');
            btn.text("获取验证码");
            clearTimeout(timer);
            return false;
        } else {
            sTime--;
            setTimeout(arguments.callee, 1000);
        }
        btn.text(sTime + "s后重新获取");
    }, 500);
}
</script>